<%@ taglib uri="/tags/struts-tiles" prefix="tiles" %>
<%@ taglib uri="/tags/jstl-core" prefix="c" %>
<%@ taglib uri="/tags/jstl-fmt" prefix="fmt" %>
<%@ taglib uri="/tags/struts-html" prefix="html" %>
<%@ taglib uri="/tags/struts-bean" prefix="bean" %>

<html>
	<head>
        <meta http-equiv="refresh" content="10">
		<title><tiles:getAsString name="titulo" /></title>
		<link rel="stylesheet" type="text/css" href="./css/repro.css" />
	</head>
    <body>
        
        <div id="cabecera">
            <p class="txtcab"><fmt:message key="pantRepro.titulo"/></p>
        </div>
        <!-- listado canciones -->        
        <div id="canciones">
            <div id="titlist"><span class="nota"><fmt:message key="pantRepro.biblioteca"/></span><br/>
                <span class="nota"><fmt:message key="pantRepro.instrucciones"/></span>
            </div>

   <c:forEach items="${applicationScope.canciones}" var="cancion" begin="0" end="15" varStatus="status"> 
                <div class="celda">
                    <img src="./img/caratulas/<c:out value="${cancion.caratula}"/>" width="85" height="85" border="0"/>
                    <span class="autor"><c:out value="${cancion.id} - ${cancion.autor}"/></span>
                    <span class="titolo"><c:out value="${cancion.titulo}"/></span>
                </div>
   </c:forEach>
        </div>
        <!-- lista reproduccion --> 
        <div id="tracklist">
            <div id="titlist"><fmt:message key="pantRepro.listaRepro"/></div>
<c:forEach items="${requestScope.reproducidas}" var="cancion"  varStatus="status">
            <div id="p<c:out value="${status.count % 2}"/><c:if test="${status.first}">1</c:if>"><c:out value="${cancion.autor} - ${cancion.titulo}"/>
			<ul>
			<c:forEach items="${cancion.peticiones}" var="peticion">
			<li><c:out value="${peticion.dedicatoria}"/></li>
			</c:forEach>
			</ul>
            </div>
</c:forEach>			           
        </div>
        <!-- cola --> 
        <div id="cola">
            <div id="titlist"><fmt:message key="pantRepro.colaPeticiones"/></div>
<c:forEach items="${requestScope.cola}" var="cancion" varStatus="status">
            <div id="p<c:out value="${status.count % 2}"/>"><c:out value="${cancion.autor} - ${cancion.titulo}"/> <fmt:formatDate value="${cancion.fchUltRep}" type="both" pattern="dd/MM/yy hh:mm"/>
			<ul>
			<c:forEach items="${cancion.peticiones}" var="peticion">
			<li><c:out value="${peticion.dedicatoria}"/></li>
			</c:forEach>
			</ul>
            </div>
</c:forEach>
       
        </div>

		<html:errors/>
        
    </body>
</html>